<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>后台图片轮播</title>
    <link href="swiper.min.css" rel="stylesheet" type="text/css">
    <script src="swiper.min.js"></script>
    <script src="jquery.js"></script>
</head>
<body>
<!--广告位-->
<div id="lifeSwiper" style="position:relative;overflow:hidden;">
    <div id="life_swipe" class="swiper-wrapper">
        <div class="swiper-slide">
            <a href="#" target=""><img src="#" width="100%"></a>
        </div>
    </div>
    <div class="swiper-pagination"></div>
</div>

</body>
<script>

        $.post('http://wx.hzsanteng.com/api/car300/adList', function (msg) {
            try {
                var obj = JSON.parse(msg);
                if (obj.status == 1) {
                    var html = '';
                    $.each(obj.ad, function (i, item) {
                        html += '<div class="swiper-slide">' +
                                '<a href="' + item.href + '" target="' + item.opentype + '">' +
                                '<img src="http://wx.hzsanteng.com/' + item.ad_url + '" width="100%">' +
                                '</a>' +
                                '</div>';
                    });
                    $('#life_swipe').html(html);
                }
                var lifeSwiper = null;
                if (!lifeSwiper) {
                    lifeSwiper = new Swiper('#lifeSwiper', {
                        pagination: ".swiper-pagination",
                        autoplay: 2000,//可选选项，自动滑动
                        loop: true,//可选选项，开启循环
                        autoplayDisableOnInteraction: false
                    });
                } else {
                    lifeSwiper.appendSlide($('#life_swipe .swiper-slide'));
                    lifeSwiper.startAutoplay();
                }
            } catch (e) {
            }
        });

</script>
</html>